<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>静态文件测试</title>
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
</head>
<body>
    <div class="container mt-5">
        <div class="row">
            <div class="col-md-6">
                <div class="card">
                    <div class="card-header">
                        <h5>本地Bootstrap JS测试</h5>
                    </div>
                    <div class="card-body">
                        <button class="btn btn-primary" onclick="testBootstrap()">测试Bootstrap功能</button>
                        <div id="bootstrapResult" class="mt-3"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="card">
                    <div class="card-header">
                        <h5>本地Axios测试</h5>
                    </div>
                    <div class="card-body">
                        <button class="btn btn-success" onclick="testAxios()">测试Axios功能</button>
                        <div id="axiosResult" class="mt-3"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 本地静态文件 -->
    <script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/axios.min.js') }}"></script>

    <script>
        function testBootstrap() {
            const result = document.getElementById('bootstrapResult');
            if (typeof bootstrap !== 'undefined') {
                result.innerHTML = '<div class="alert alert-success">✅ Bootstrap 加载成功！</div>';
            } else {
                result.innerHTML = '<div class="alert alert-danger">❌ Bootstrap 加载失败！</div>';
            }
        }

        function testAxios() {
            const result = document.getElementById('axiosResult');
            if (typeof axios !== 'undefined') {
                result.innerHTML = '<div class="alert alert-success">✅ Axios 加载成功！</div>';
                // 测试axios请求
                axios.get('/api/config')
                    .then(response => {
                        result.innerHTML += '<div class="alert alert-info">✅ Axios 请求成功！</div>';
                    })
                    .catch(error => {
                        result.innerHTML += '<div class="alert alert-warning">⚠️ Axios 请求失败：' + error.message + '</div>';
                    });
            } else {
                result.innerHTML = '<div class="alert alert-danger">❌ Axios 加载失败！</div>';
            }
        }
    </script>
</body>
</html> 